import React, {PureComponent} from "react";
import {Table} from "antd";
import {connect} from "react-redux";
import {tableProps} from "../../lib/ui";
import {query, saveFilter} from "./actions";
import {getAllOrganization} from "../organization/actions";
import moment from "moment";
import {DATE_FORMAT} from "../../lib/func";
import {getLastFilter} from "../../lib/identity";
const LAST_FILTER = "orderProfit";

class List extends PureComponent {

    componentWillMount() {
        const {dispatch} = this.props;
        let fields = getLastFilter(LAST_FILTER);
        if (fields === null || fields === undefined) {
            fields = {};
            const createTimeRange = [moment().startOf('month'), moment().endOf('month')];
            // 默认查当月
            fields.createTimeStart = createTimeRange[0].format(DATE_FORMAT);
            fields.createTimeEnd = createTimeRange[1].format(DATE_FORMAT);
        }
        dispatch(query({...fields}));
        dispatch(saveFilter({...fields}));
        dispatch(getAllOrganization());
    };

    createNewData = data => {
        data.forEach(item => {
            item['groupKey'] = item['clientId'] + item['businessType']
        });
        return data.reduce((result, item) => {
            //首先将clientId字段作为新数组result取出
            if (result.indexOf(item.groupKey) < 0) {
                result.push(item.groupKey)
            }
            return result
        }, []).reduce((result, id) => {
            //将clientId相同的数据作为新数组取出，并在其内部添加新字段**rowSpan**
            const children = data.filter(item => item.groupKey === id);
            result = result.concat(children.map((item, index) => ({
                ...item, rowSpan: index === 0 ? children.length : 0,//将第一行数据添加rowSpan字段
            })))
            return result;
        }, [])
    };

    render() {
        const {
            dataSource, loading,
        } = this.props;

        const columns = [{
            title: "客户", dataIndex: "client", width: "150px", render: (text, record) => {
                return {
                    children: record.client, props: {
                        rowSpan: record.rowSpan,
                    }
                }
            }
        }, {
            title: "应收运费", children: [{
                title: '人民币',
                dataIndex: 'incomeTransportFeeRmb',
                key: 'incomeTransportFeeRmb',
                width: 90,
                render: (text, record) => {
                    return {
                        children: record.incomeTransportFeeRmb.toFixed(2), props: {
                            rowSpan: record.rowSpan,
                        }
                    }
                }
            }, {
                title: '美金',
                dataIndex: 'incomeTransportFeeUsd',
                key: 'incomeTransportFeeUsd',
                width: 90,
                render: (text, record) => {
                    return {
                        children: record.incomeTransportFeeUsd.toFixed(2), props: {
                            rowSpan: record.rowSpan,
                        }
                    }
                }
            }]
        }, {
            title: "应收杂费", children: [{
                title: '人民币',
                dataIndex: 'incomeOtherFeeRmb',
                key: 'incomeOtherFeeRmb',
                width: 90,
                render: (text, record) => {
                    return {
                        children: record.incomeOtherFeeRmb.toFixed(2), props: {
                            rowSpan: record.rowSpan,
                        }
                    }
                }
            }, {
                title: '美金',
                dataIndex: 'incomeOtherFeeUsd',
                key: 'incomeOtherFeeUsd',
                width: 90,
                render: (text, record) => {
                    return {
                        children: record.incomeOtherFeeUsd.toFixed(2), props: {
                            rowSpan: record.rowSpan,
                        }
                    }
                }
            }]
        }, {
            title: "应收合计款", children: [{
                title: '人民币', dataIndex: 'totalIncomeRmb', key: 'totalIncomeRmb', width: 90, render: (text, record) => {
                    return {
                        children: record.totalIncomeRmb.toFixed(2), props: {
                            rowSpan: record.rowSpan,
                        }
                    }
                }
            }, {
                title: '美金', dataIndex: 'totalIncomeUsd', key: 'totalIncomeUsd', width: 90, render: (text, record) => {
                    return {
                        children: record.totalIncomeUsd.toFixed(2), props: {
                            rowSpan: record.rowSpan,
                        }
                    }
                }
            }]
        }, {
            title: "供应商", dataIndex: "carrier", width: "150px",
        }, {
            title: "应付运费", children: [{
                title: '人民币',
                dataIndex: 'payTransportFeeRmb',
                key: 'payTransportFeeRmb',
                width: 90,
                render: text => <span>{text && Number(text).toFixed(2)}</span>
            }, {
                title: '美金',
                dataIndex: 'payTransportFeeUsd',
                key: 'payTransportFeeUsd',
                width: 90,
                render: text => <span>{text && Number(text).toFixed(2)}</span>
            }]
        }, {
            title: "应付杂费", children: [{
                title: '人民币',
                dataIndex: 'payOtherFeeRmb',
                key: 'payOtherFeeRmb',
                width: 90,
                render: text => <span>{text && Number(text).toFixed(2)}</span>
            }, {
                title: '美金',
                dataIndex: 'payOtherFeeUsd',
                key: 'payOtherFeeUsd',
                width: 90,
                render: text => <span>{text && Number(text).toFixed(2)}</span>
            }]
        }, {
            title: "应付合计款", children: [{
                title: '人民币',
                dataIndex: 'totalPayRmb',
                key: 'totalPayRmb',
                width: 90,
                render: text => <span>{text && Number(text).toFixed(2)}</span>
            }, {
                title: '美金',
                dataIndex: 'totalPayUsd',
                key: 'totalPayUsd',
                width: 90,
                render: text => <span>{text && Number(text).toFixed(2)}</span>
            }]
        }, {
            title: "财务归属", dataIndex: "orgName", width: "120px"
        }, {
            title: "营业利润(rmb)", dataIndex: "currentAssets", width: "120px", render: (text, record) => {
                return {
                    children: record.currentAssets.toFixed(2), props: {
                        rowSpan: record.rowSpan,
                    }
                }
            }
        }, {
            title: "业务类型", dataIndex: "businessType", width: "120px", render: (text, record) => {
                return {
                    children: record.businessType, props: {
                        rowSpan: record.rowSpan,
                    }
                }
            }
        }];
        return (<Table
            {...tableProps}
            columns={columns}
            scroll={{x: 1500, y: 'calc(100vh - 380px)'}}
            dataSource={this.createNewData(dataSource)}
            pagination={false}
            loading={loading}
        />);
    }
}

const mapStateToProps = state => {
    return {
        ...state.orderProfit.list
    };
};

export default connect(mapStateToProps)(List);
